<template>
  <el-card class="mb-20px" shadow="hover">
    <div class="mx-10px leading-10">
      <el-row :gutter="20" justify="space-between">
        <span :class="`${prefixCls}__item--text text-20px font-semibold`">
          {{ item.name }}
        </span>
        <!-- <span :class="`${prefixCls}__item--text text-14px text-blue-500`">
              <el-button type="primary" link :icon="Edit" @click="openForm('update', item.id)"
                >查看</el-button
              >
            </span> -->
      </el-row>
    </div>
    <el-divider border-style="dashed" style="margin: 10px 0" />
    <div class="mx-10px leading-10">
      <el-row :gutter="20" v-if="type === 1">
        <span :class="`${prefixCls}__item--text text-14px text-gray-500 font-semibold`">
          申请职位：
        </span>
        <span :class="`${prefixCls}__item--text text-14px text-gray-500`">
          {{ item.deliveryPositionName }}
        </span>
      </el-row>
      <el-row :gutter="20">
        <span :class="`${prefixCls}__item--text text-14px text-gray-500 font-semibold`">
          出生日期：
        </span>
        <span :class="`${prefixCls}__item--text text-14px text-gray-500`">
          {{ formatDate(item.birthday, 'YYYY-MM-DD') }}
        </span>
      </el-row>
      <el-row :gutter="20">
        <span :class="`${prefixCls}__item--text text-14px text-gray-500 font-semibold`">
          学历：
        </span>
        <span :class="`${prefixCls}__item--text text-14px text-gray-500`">
          <dict-tag
            :type="DICT_TYPE.HOSPITAL_RECRUITMENT_EDUCATION_LEVEL"
            :value="item.educationLevel"
          />
        </span>
      </el-row>
    </div>
    <div class="mx-10px leading-8">
      <el-row :gutter="20">
        <span :class="`${prefixCls}__item--text text-14px text-gray-500 font-semibold`">
          地址：
        </span>
        <span :class="`${prefixCls}__item--text text-14px text-gray-500`">
          {{ item.address }}
        </span>
      </el-row>
    </div>
    <div class="mx-10px leading-6">
      <el-row :gutter="20">
        <span :class="`${prefixCls}__item--text text-14px text-gray-500 font-semibold`">
          个人简介：
        </span>
      </el-row>
    </div>
    <div class="leading-6 min-h-22 bg-gray-100 p-10px px-20px rounded-5px my-5px">
      <el-row :gutter="20">
        <el-popover
          :content="item.profile"
          placement="right-end"
          popper-style="min-width: 200px; width: 20%"
        >
          <template #reference>
            <span :class="`${prefixCls}__item--text text-14px text-gray-500 line-clamp-3`">
              {{ item.profile }}
            </span>
          </template>
        </el-popover>
      </el-row>
    </div>
    <div class="mx-10px leading-6">
      <el-row :gutter="20">
        <span :class="`${prefixCls}__item--text text-14px text-gray-500 font-semibold`">
          专业技能：
        </span>
      </el-row>
    </div>
    <div class="leading-6 min-h-22 bg-gray-100 p-10px px-20px rounded-5px my-5px">
      <el-row :gutter="20">
        <el-popover
          :content="item.skill"
          placement="right-end"
          popper-style="min-width: 200px; width: 20%"
        >
          <template #reference>
            <span :class="`${prefixCls}__item--text text-14px text-gray-500 line-clamp-3 `">
              {{ item.skill }}
            </span>
          </template>
        </el-popover>
      </el-row>
    </div>
    <div class="mx-10px leading-10">
      <el-row :gutter="20" justify="space-between">
        <!-- <span :class="`${prefixCls}__item--text text-14px text-gray-500`"> 薪资： </span> -->
        <span :class="`${prefixCls}__item--text text-22px text-red-400`">
          {{ item.minSalaryExpect }} - {{ item.maxSalaryExpect }}
        </span>

        <span :class="`${prefixCls}__item--text text-14px text-gray-500`" v-if="type === 1">
          <el-button type="success" link @click="openForm(item)">
            查看详情<el-icon><ArrowRightBold /></el-icon>
          </el-button>
        </span>
      </el-row>
    </div>

    <div v-if="type === 2">
      <el-divider border-style="dashed" style="margin: 10px 0" />

      <div class="mx-10px leading-10">
        <el-row :gutter="20" justify="space-between">
          <span :class="`${prefixCls}__item--text text-16px font-semibold`"> 教育经历 </span>
        </el-row>
      </div>

      <div v-if="studyList.length < 1" class="leading-20 text-center"> 暂无教育经历 </div>

      <div v-for="(item2, index) of studyList" :key="index">
        <div class="px-20px py-6px mb-6px bg-gray-100 rounded-5px">
          <el-row :gutter="20" justify="space-between">
            <el-col :span="12">
              <el-row :gutter="20">
                <!-- <span :class="`${prefixCls}__item--text text-14px text-gray-500 font-semibold`">
                  学校名称：
                </span> -->
                <span :class="`${prefixCls}__item--text text-14px text-gray-500`">
                  {{ item2.schoolName }}
                </span>
              </el-row>
            </el-col>

            <span :class="`${prefixCls}__item--text text-14px text-gray-500`">
              {{ item2.startTime }} - {{ item2.endTime }}
            </span>
          </el-row>
          <el-row :gutter="20" justify="space-between">
            <el-col :span="12">
              <el-row :gutter="20">
                <!-- <span :class="`${prefixCls}__item--text text-14px text-gray-500 font-semibold`">
                  专业：
                </span> -->
                <span :class="`${prefixCls}__item--text text-14px text-gray-500`">
                  {{ item2.major }}
                </span>
              </el-row>
            </el-col>
            <dict-tag :type="DICT_TYPE.HOSPITAL_RECRUITMENT_EDUCATION_LEVEL" :value="item2.level" />
          </el-row>
        </div>
      </div>

      <el-divider border-style="dashed" style="margin: 10px 0" />

      <div class="mx-10px leading-10">
        <el-row :gutter="20" justify="space-between">
          <span :class="`${prefixCls}__item--text text-16px font-semibold`"> 工作经历 </span>
        </el-row>
      </div>

      <div v-if="workList.length < 1" class="leading-20 text-center"> 暂无工作经历 </div>

      <div :span="6" v-for="(item2, index) of workList" :key="index">
        <div class="px-20px py-6px mb-6px bg-gray-100 rounded-5px">
          <el-row :gutter="20" justify="space-between">
            <el-col :span="12">
              <el-row :gutter="20">
                <!-- <span :class="`${prefixCls}__item--text text-14px text-gray-500 font-semibold`">
                  学校名称：
                </span> -->
                <span :class="`${prefixCls}__item--text text-14px text-gray-500`">
                  {{ item2.companyName }} - {{ item2.position }}
                </span>
              </el-row>
            </el-col>

            <span :class="`${prefixCls}__item--text text-14px text-gray-500`">
              {{ item2.startTime }} - {{ item2.endTime }}
            </span>
          </el-row>
          <el-row :gutter="20">
            <span :class="`${prefixCls}__item--text text-14px text-gray-500 font-semibold`">
              工作内容：
            </span>
            <span :class="`${prefixCls}__item--text text-14px text-gray-500`">
              {{ item2.content }}
            </span>
          </el-row>
        </div>
      </div>
    </div>
    <!-- <br /> -->

    <!-- <div :class="`${prefixCls}__item--text text-12px text-gray-500`"> 应聘进度 </div>
              <el-progress :percentage="50" /> -->
  </el-card>

  <!-- 表单弹窗：添加/修改 -->
  <RecruitmentResumeDeliveryForm ref="formRef" />
</template>

<script lang="ts" setup>
import { PropType } from 'vue'
import { getIntDictOptions, getStrDictOptions, DICT_TYPE } from '@/utils/dict'

import RecruitmentPositionForm from './RecruitmentPositionForm.vue'

import { formatDate } from '@/utils/formatTime'

import { ArrowRightBold, Edit } from '@element-plus/icons-vue'

import RecruitmentResumeDeliveryForm from './resumedelivery/RecruitmentResumeDeliveryForm.vue'

interface ItemType {}

const props = defineProps({
  list: {
    type: Array as PropType<ItemType[]>,
    default: () => []
  },
  studyList: {
    type: Array as PropType<ItemType[]>,
    default: () => []
  },
  workList: {
    type: Array as PropType<ItemType[]>,
    default: () => []
  },
  item: {
    type: Object,
    default: () => {}
  },
  type: {
    type: Number,
    default: 1
  }
})

console.log('props.list')
console.log(props.list)

/** 添加/修改操作 */
const formRef = ref()
const openForm = (item?: any) => {
  formRef.value.open(item.memberUserId)
}
</script>